<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Watermark - Documentation</title>

    <script src="scripts/prettify/prettify.js"></script>
    <script src="scripts/prettify/lang-css.js"></script>
    <!--[if lt IE 9]>
      <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <link type="text/css" rel="stylesheet" href="styles/prettify.css">
    <link type="text/css" rel="stylesheet" href="styles/jsdoc.css">
</head>
<body>

<input type="checkbox" id="nav-trigger" class="nav-trigger" />
<label for="nav-trigger" class="navicon-button x">
  <div class="navicon"></div>
</label>

<label for="nav-trigger" class="overlay"></label>

<nav>
    <h2><a href="index.html">Home</a></h2><h3>Classes</h3><ul><li><a href="Watermark.html">Watermark</a><ul class='members'><li data-type='member'><a href="Watermark.html#.config">config</a></li><li data-type='member'><a href="Watermark.html#$options">$options</a></li></ul><ul class='methods'><li data-type='method'><a href="Watermark.html#load">load</a></li><li data-type='method'><a href="Watermark.html#show">show</a></li><li data-type='method'><a href="Watermark.html#hide">hide</a></li><li data-type='method'><a href="Watermark.html#clean">clean</a></li><li data-type='method'><a href="Watermark.html#destory">destory</a></li></ul></li></ul>
</nav>

<div id="main">
    
    <h1 class="page-title">Watermark</h1>
    

    




<section>

<header>
    
        <h2>
        Watermark
        </h2>
        
            <div class="class-description"><p>水印插件类</p></div>
        
    
</header>

<article>
    <div class="container-overview">
    
        

    
    <h2>Constructor</h2>
    

    <h4 class="name" id="Watermark"><span class="type-signature"></span>new Watermark<span class="signature">(options<span class="signature-attributes">opt</span>)</span><span class="type-signature"></span></h4>

    




<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>构造函数</p>
</div>











    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        
        <th>Attributes</th>
        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>options</code></td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                

                
                </td>
            

            

            <td class="description last"><p>水印配置参数，具体见 $options</p></td>
        </tr>

    
    </tbody>
</table>
















    
    </div>

    

    

    

     

    

    
        <h3 class="subsection-title">Members</h3>

        
            
<h4 class="name" id=".config"><span class="type-signature">(static) </span>config<span class="type-signature"> :Object</span></h4>





<dl class="details">

    

    

    
    <dt class="tag-since">Since:</dt>
    <dd class="tag-since"><ul class="dummy"><li>0.0.1</li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>设置全局配置参数：会作用于全部，生成实例时都会使用 全局默认配置覆盖实例默认配置，具体配置参数内容见 $options</p>
</div>



    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>






        
            
<h4 class="name" id="$options"><span class="type-signature"></span>$options<span class="type-signature"> :Object</span></h4>





<dl class="details">

    

    

    
    <dt class="tag-since">Since:</dt>
    <dd class="tag-since"><ul class="dummy"><li>0.0.1</li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>



    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>el</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>
|

<span class="param-type">Selector</span>
|

<span class="param-type">Element</span>


            
            </td>

            

            
                <td class="default">
                
                    <code>document.body</code>
                
                </td>
            

            <td class="description last"><p>附加水印的目标节点DOM</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>content</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>
|

<span class="param-type">Selector</span>
|

<span class="param-type">Element</span>


            
            </td>

            

            
                <td class="default">
                
                    <code>'请设置水印内容'</code>
                
                </td>
            

            <td class="description last"><p>水印内容，注：如果是 IE9 以下，选择器使用id方式，标准浏览器可以使用class</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>type</code></td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            
                <td class="default">
                
                    <code>1</code>
                
                </td>
            

            <td class="description last"><p>水印类型，可选值：1（文字水印），2（图片水印）</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>repeat</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            
                <td class="default">
                
                    <code>xy</code>
                
                </td>
            

            <td class="description last"><p>水印平辅方式，可选值：x（水平平辅），y（垂直平辅），##xy（水平与垂直平辅）##</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>elClass</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            
                <td class="default">
                
                    <code>'ext-watermark'</code>
                
                </td>
            

            <td class="description last"><p>水印外包裹dom 样式命名空间</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>contentClass</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            
                <td class="default">
                
                    <code>'ext-watermark-content'</code>
                
                </td>
            

            <td class="description last"><p>水印dom 样式命名空间</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>zIndex</code></td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            
                <td class="default">
                
                    <code>0</code>
                
                </td>
            

            <td class="description last"><p>水印包裹器的堆叠层级</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>bgColor</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            
                <td class="default">
                
                    <code>'#fff'</code>
                
                </td>
            

            <td class="description last"><p>水印包裹器的背景颜色</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>opacity</code></td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            
                <td class="default">
                
                    <code>1</code>
                
                </td>
            

            <td class="description last"><p>水印包裹器的透明度，范围为0-1</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>width</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            
                <td class="default">
                
                    <code>'auto'</code>
                
                </td>
            

            <td class="description last"><p>水印内容的宽度，可以使用任意单位</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>height</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            
                <td class="default">
                
                    <code>'auto'</code>
                
                </td>
            

            <td class="description last"><p>水印内容的高度，可以使用任意单位</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>padding</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            
                <td class="default">
                
                    <code>'0px</code>
                
                </td>
            

            <td class="description last"><p>300px 100px 300px' - 水印内容的内边距，可以使用任意单位</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>margin</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            
                <td class="default">
                
                    <code>'auto'</code>
                
                </td>
            

            <td class="description last"><p>水印内容的外边距，可以使用任意单位</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>rotate</code></td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            
                <td class="default">
                
                    <code>346</code>
                
                </td>
            

            <td class="description last"><p>水印旋转角度</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>color</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            
                <td class="default">
                
                    <code>'#e4e4e4'</code>
                
                </td>
            

            <td class="description last"><p>水印颜色</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>fontSize</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            
                <td class="default">
                
                    <code>'30px'</code>
                
                </td>
            

            <td class="description last"><p>水印内容字号，可以使用任意单位</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>fontFamily</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            
                <td class="default">
                
                    <code>'simsun'</code>
                
                </td>
            

            <td class="description last"><p>水印内容字体样式</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>lineHeight</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            
                <td class="default">
                
                    <code>'2'</code>
                
                </td>
            

            <td class="description last"><p>水印内容行高，可以使用任意单位</p></td>
        </tr>

    
    </tbody>
</table>








    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>






        
    

    
        <h3 class="subsection-title">Methods</h3>

        
            

    

    <h4 class="name" id="load"><span class="type-signature"></span>load<span class="signature">(content)</span><span class="type-signature"></span></h4>

    




<dl class="details">

    

    

    
    <dt class="tag-since">Since:</dt>
    <dd class="tag-since"><ul class="dummy"><li>0.0.1</li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>载入水印内容</p>
</div>











    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>content</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>
|

<span class="param-type">Selector</span>
|

<span class="param-type">Element</span>


            
            </td>

            

            

            <td class="description last"><p>水印内容：可以是一个字符串、也可以是一个简易选择器字符串，或者是一个 DOM 节点</p></td>
        </tr>

    
    </tbody>
</table>
















        
            

    

    <h4 class="name" id="show"><span class="type-signature"></span>show<span class="signature">()</span><span class="type-signature"></span></h4>

    




<dl class="details">

    

    

    
    <dt class="tag-since">Since:</dt>
    <dd class="tag-since"><ul class="dummy"><li>0.0.1</li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>显示水印</p>
</div>

























        
            

    

    <h4 class="name" id="hide"><span class="type-signature"></span>hide<span class="signature">()</span><span class="type-signature"></span></h4>

    




<dl class="details">

    

    

    
    <dt class="tag-since">Since:</dt>
    <dd class="tag-since"><ul class="dummy"><li>0.0.1</li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>隐藏水印</p>
</div>

























        
            

    

    <h4 class="name" id="clean"><span class="type-signature"></span>clean<span class="signature">()</span><span class="type-signature"></span></h4>

    




<dl class="details">

    

    

    
    <dt class="tag-since">Since:</dt>
    <dd class="tag-since"><ul class="dummy"><li>0.0.1</li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>清空实例对象 DOM</p>
</div>

























        
            

    

    <h4 class="name" id="destory"><span class="type-signature"></span>destory<span class="signature">()</span><span class="type-signature"></span></h4>

    




<dl class="details">

    

    

    
    <dt class="tag-since">Since:</dt>
    <dd class="tag-since"><ul class="dummy"><li>0.0.1</li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>销毁实例对象</p>
</div>

























        
    

    

    
</article>

</section>




</div>

<br class="clear">

<footer>
    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.4.0</a> using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
</footer>

<script>prettyPrint();</script>
<script src="scripts/linenumber.js"></script>
</body>
</html>